import { Tabs } from '@nutui/nutui-react';
import React, { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import HotService from './HotService';

const ServiceInfo = () => {
    const [tabValue, setTabValue] = useState(0);
    const navigate = useNavigate();
    
    const handleTabChange = (value) => {
        if (value === 3) {
            navigate('/products');
        } else {
            setTabValue(value);
        }
    };
    
    return (
        <Tabs
            value={tabValue}
            defaultValue={0}
            onChange={handleTabChange}
            activeType="smile"
        >
           <Tabs.TabPane title="热门推荐">
                <HotService />
            </Tabs.TabPane>
            <Tabs.TabPane title="专家|技师">123</Tabs.TabPane>
            <Tabs.TabPane title="评价">123</Tabs.TabPane>
            <Tabs.TabPane title="更多">123</Tabs.TabPane>
        </Tabs>
    );
};

export default ServiceInfo;
